import React, {useState, useMemo} from 'react';

function ExampleHook8(){
  const [xiaohong, setXiaohong] = useState('我是小红')
  const [zhiling, setZhiling] = useState('我是志玲')

  return (
    <>
      <button onClick={()=>{setXiaohong(new Date().getTime())}}>小红</button>
      <button onClick={()=>{setZhiling(new Date().getTime()+"志玲")}}>志玲</button>
      <ChildComponent name={xiaohong}>{zhiling}</ChildComponent>
    </>
  )
}

function ChildComponent({name, children}){
  function changeXiaohong(){
    console.log("她来了~")
    return name + ',小红'
  }
  const actionXiaohong = useMemo(()=>changeXiaohong(name), [name])

  return (
    <>
      <div>{actionXiaohong}</div>
      <div>{children}</div>
    </>
  )
}

export default ExampleHook8